Ext.define('EUF.view.Main', {
	extend : 'Ext.form.Panel',
    alias :'widget.mainview',
	id:'header',
	width : '100%',
    layout: {
        type: 'auto'
    },

    initComponent: function() {
        var me = this;
 var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
        clicksToMoveEditor: 1,
        autoCancel: false
    });
        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'toolbar',
                    height: 48,
                    items: [
                        {
                            xtype: 'image',
                            height: 50,
                            width: 170,
                            src: 'images/titi.png'
                        },
                        {
                            xtype: 'tbfill'
                        },
                        {
							xtype: 'button',
							text: 'Submit',
							id: 'submit',
							cls: 'button-link',
							//style: "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif 
                            //xtype: 'image',
                            //height: 48,
                            //padding: 10,
                            //width: 48,
                            //src: 'images/cross.png'
                        }
                    ]
                },
                {
                    xtype: 'container',
                    layout: {
                        type: 'column'
                    },
                    items: [
                        {
                            xtype: 'container',
                            columnWidth: 0.5,
                            items: [
                                {
                                    xtype: 'container',
                                    
                                    margin: 70,
                                    width: 300,
                                    
                                   
                                    layout: {
                                        type: 'column'
                                    },
                                    items: [
                                        {
                                            xtype: 'fieldcontainer',
                                            height: 70,
                                            width: 68,
                                            layout: {
                                                align: 'stretch',
                                                type: 'vbox'
                                            },
                                            fieldLabel: '',
                                            columnWidth: 0.14,
                                            items: [
                                                {
                                                    xtype: 'image',
                                                    margin: '',
                                                    padding: '',
                                                    src: 'images/request.png',
                                                    flex: 1
                                                },
                                                {
                                                    xtype: 'label',
                                                    height: 3,
                                                    margin: '0 0 0 2',
                                                    width: 24,
                                                    text: 'Name',
                                                    flex: 1
                                                }
                                            ]
                                        },
                                        {
                                            xtype: 'textfield',
										//	store: 'SubmitRequestStore',
                                            margin: '10 0 0 25',
                                            overCls:'shadow',
											name:'name',
                                           
                                           
                                            fieldLabel: '',                                          
                                                                                      
                                            columnWidth: 0.81,
                                            listeners: {
                                                render: function() {
                                                    this.getEl().on('mouseenter', function(){
                                                        // 500 - is the select timeout
                                                        this.timeout = setTimeout(this.timeoutHandler.bind(this), 200);
                                                    }, this);
                                                    this.getEl().on('mouseleave', function(){
                                                        clearTimeout(this.timeout);
                                                    }, this);
                                                }
                                            },
                                            timeoutHandler: function() {
                                                this.selectText();
                                                this.focus();
                                            },
                                        }
                                    ]
                                },
                                {
                                    xtype: 'container',
                                    
                                    height: 81,
                                    
                                    margin: 70,
                                    
                                    width: 318,
                                    layout: {
                                        type: 'column'
                                    },
                                    items: [
                                        {
                                            xtype: 'fieldcontainer',
                                            height: 70,
                                            width: 68,
                                            layout: {
                                                align: 'stretch',
                                                type: 'vbox'
                                            },
                                            fieldLabel: '',
                                            columnWidth: 0.14,
                                            items: [
                                                {
                                                    xtype: 'image',
                                                    margin: '',
                                                    padding: '',
                                                    src: 'images/request.png',
                                                    flex: 1
                                                },
                                                {
                                                    xtype: 'label',
                                                    height: 35,
                                                    margin: '',
                                                    padding: '',
                                                    width: 40,
                                                    text: 'Class',
                                                    flex: 1
                                                }
                                            ]
                                      },                                                                                
                                                
                                        
                                        {
                                            xtype: 'combobox',
                                           
											store: 'SubmitRequestStore',
                                            margin: '10 0 0 25',
                                            fieldLabel: '',
                                            overCls: 'shadow',
                                            
                                            columnWidth: 0.81,
                                            listeners: {
                                                render: function() {
                                                    this.getEl().on('mouseenter', function(){
                                                        // 500 - is the select timeout
                                                        this.timeout = setTimeout(this.timeoutHandler.bind(this), 500);
                                                    }, this);
                                                    this.getEl().on('mouseleave', function(){
                                                        clearTimeout(this.timeout);
                                                    }, this);
                                                }
                                            },
                                            timeoutHandler: function() {
                                                this.selectText();
                                                this.focus();
                                            },
                                        },
                                     
                                    ]
                                }
                            ]
                        },
                        {
                            xtype: 'container',
                            columnWidth: 0.5,
                            items: [
                                {
                                    xtype: 'container',
                                    
                                    margin: '60 70 70 70',
                                    width: 300,
                                    
                                    layout: {
                                        type: 'column'
                                    },
                                    items: [
                                        {
                                            xtype: 'fieldcontainer',
                                            height: 70,
                                            width: 68,
                                            layout: {
                                                align: 'stretch',
                                                type: 'vbox'
                                            },
                                            fieldLabel: '',
                                            columnWidth: 0.16,
                                            items: [
                                                {
                                                    xtype: 'image',
                                                    margin: '',
                                                    padding: '',
                                                    src: 'images/userdetails.png',
                                                    flex: 1
                                                },
                                                {
                                                    xtype: 'label',
                                                    height: 3,
                                                    width: 24,
                                                    text: 'Father"s Name',
                                                    flex: 1
                                                }
                                            ]
                                        },
                                        {
                                            xtype: 'textfield',
                                            margin: '10 0 0 25',
                                            fieldLabel: '',
                                            overCls: 'shadow',
                                            columnWidth: 0.81,
                                            listeners: {
                                                render: function() {
                                                    this.getEl().on('mouseenter', function(){
                                                        // 500 - is the select timeout
                                                        this.timeout = setTimeout(this.timeoutHandler.bind(this), 200);
                                                    }, this);
                                                    this.getEl().on('mouseleave', function(){
                                                        clearTimeout(this.timeout);
                                                    }, this);
                                                }
                                            },
                                            timeoutHandler: function() {
                                                this.selectText();
                                                this.focus();
                                            },
                                            
                                        }
                                    ]
                                },
                                {
                                    xtype: 'container',
                                    margin: '70 70 70 60',
                                    width: 480,
                                    selectOnFocus: true,
                                   
                                    layout: {
                                        type: 'column'
                                    },
                                    items: [
                                        {
                                            xtype: 'fieldcontainer',
                                            height: 80,
                                            layout: {
                                                align: 'stretch',
                                                type: 'vbox'
                                            },
                                            fieldLabel: '',
                                            columnWidth: 0.13,
                                            items: [
                                                {
                                                    xtype: 'image',
                                                    height: 60,
                                                    margin: '',
                                                    
                                                    padding: '',
                                                    width: 60,
                                                    src: 'images/notes.png'
                                                },
                                                {
                                                    xtype: 'label',
                                                    
                                                    margin: '',
                                                    text: 'Address',

                                                    flex: 1,
                                                    margins: '0 0 0 14',
													
                                                }
                                            ]
                                        },
                                        
                                        
                                        {
                                            xtype: 'textareafield',
                                            height: 76,
                                            overCls: 'shadow',
                                            margin: '3 0 0 19',
                                            resizable: true,
                                            
                                            columnWidth: 0.51,
											name:'notes',
											listeners: {
									            render: function() {
									                this.getEl().on('mouseenter', function(){
									                    // 500 - is the select timeout
									                    this.timeout = setTimeout(this.timeoutHandler.bind(this), 200);
									                }, this);
									                this.getEl().on('mouseleave', function(){
									                    clearTimeout(this.timeout);
									                }, this);
									            }
									        },
									        timeoutHandler: function() {
									            this.selectText();
									            this.focus();
									        },
                                        }
                                    ]
                                }
                            ]
                        }
                    ]
                },				
				/*{
                    xtype: 'eyeView',
                    margin: '90 0 0 0',
                    title: 'WF Designer',
					align : 'center',
					height: 73,
					width: '100%',
                }*/
                /* {
                    xtype: 'toolbar',
                    height: 43,
                    items: [
                        {
                            xtype: 'button',
							id:'userDetails',
                            height: 36,
                            width: 123,
                            icon: 'http://cdn1.iconfinder.com/data/icons/fatcow/32x32_0460/group.png',
                            text: 'User Detail'
                        },
						
						{
                            xtype: 'button',
							margin:'0,0,0,10',
							id:'organization',
                            height: 36,
                            width: 123,
                            icon: 'http://cdn1.iconfinder.com/data/icons/customicondesignoffice5/32/organization.png',
                            text: 'Organization'
                        },
						{
                            xtype: 'button',
							margin:'0,0,0,10',
							id:'accountinfo',
                            height: 36,
                            width: 123,
                            icon: 'http://cdn1.iconfinder.com/data/icons/nuvola2/32x32/actions/messagebox_info.png',
                            text: 'Account Info'
                        },
						{
                            xtype: 'button',
							id:'userSystem',
                            height: 36,
                            width: 123,
                            icon: 'http://cdn1.iconfinder.com/data/icons/fatcow/32x32_0460/group.png',
                            text: 'System'
                        },
						
						{
                            xtype: 'button',
							margin:'0,0,0,10',
							id:'userParameters',
                            height: 36,
                            width: 123,
                            icon: 'http://cdn1.iconfinder.com/data/icons/customicondesignoffice5/32/organization.png',
                            text: 'Parameters'
                        },
						{
                            xtype: 'button',
							margin:'0,0,0,10',
							id:'userGroup',
                            height: 36,
                            width: 123,
                            icon: 'http://cdn1.iconfinder.com/data/icons/nuvola2/32x32/actions/messagebox_info.png',
                            text: 'User Group'
                        },
						

                    ]
                } */
            ],
            fbar: [{
				xtype: 'eyeView',
                //margin: '10 0 0 0',
                //title: 'WF Designer',
				//align : 'center',
				height: 60,
				width: '100%'
				/*xtype: 'container',
				style : {						
					"background-color": 'F5F5F5'  
				},
				//dock: 'bottom',
				//ui: 'footer',
				//align : 'center',
				items:[{
					xtype: 'status'
				}],
				height: 65,
				width: '100%',*/
			}],
        });

        me.callParent(arguments);
    }
});